<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小米账号-登录</title>
    <!-- 1. bootstrap.css/bootstrap.min.css -->
    <link rel="stylesheet" href="/dev/css/reset.css">
    <link rel="stylesheet" href="/dev/plugins/bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="/dev/css/login.css">
</head>

<body>
<div id="root">
    <div class="layout">
        <div class="layout-left" style="background-image: url('/dev/imgs/zlj-login-banner.jpg');"></div>
        <div class="layout-right">
            <div class="right-scroll">
                <div class="right-header">
                    <div class="header-title">
                        <div class="title-logo">
                            <div class="logo"></div>
                            <span>小米账号</span>
                        </div>
                    </div>
                    <div class="right-nav">
                        <a class="nva-item" href="">用户协议</a>
                        <div class="nav-divider"></div>
                        <a class="nva-item" href="">隐私政策</a>
                        <div class="nav-divider"></div>
                        <a class="nva-item" href="">帮助中心</a>
                    </div>
                </div>
                <div class="right-container">
                    <div class="login-card">
                        <div class="ant-tabs">
                            <div class="ant-tabs-nav">
                                <div class="login-a-1">
                                    <a href="">登录</a>
                                </div>
                                &nbsp;&nbsp;&nbsp;&nbsp;
                                <div class="login-register-1">
                                    <a href="./register.html">注册</a>
                                </div>
                            </div>
                            <div class="ant-tabs-content">
                                <form class="mi-form" action="">
                                    <div class="mi-form-content">
                                        <div class="login-email">
                                            <input title="email" type="text" name="email" id="email-account" class="email-account" placeholder="请输入邮箱：">
                                        </div>
                                        <div class="konghang"></div>
                                        <div class="login-password">
                                            <input title="email" type="password" name="password" id="email-password" class="email-password" placeholder="请输入密码：">
                                        </div>
                                        <div class="konghang"></div>
                                        <button class="login-btn" type="submit" id="login-btn" disabled>登录</button>
                                        <div class="form-actions">
                                            <div class="forn-actions-url forn-left-actions-url">
                                                <a class="clj-a clj-a-mm" href="">忘记密码</a>
                                            </div>
                                            <div class="forn-actions-url forn-right-actions-url">
                                                <a class="clj-a clj-a-yzm" href="./login-1.html">验证码登录</a>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- jquery.min.js文件 - jquery本身是js的框架. bootstrap依赖于jquery框架 -->
<script src="/dev/plugins/jquery/jquery.min.js"></script>
<!-- bootstrap.js/bootstrap.min.js -->
<script src="/dev/plugins/bootstrap/js/bootstrap.js"></script>
<script>
    $(document).ready(function() {
        $('#email-account, #email-password').on('input', function() {
            var email = $('#email-account').val();
            var password = $('#email-password').val();
            if (email && password) {
                $('#login-btn').prop('disabled', false);
            } else {
                $('#login-btn').prop('disabled', true);
            }
        });
    });
</script>
</body>
</html>